.container {
  .topContainer {
    width: 100%;
    height: 232rpx;
    background: #ffffff;
    box-shadow: 0px 2rpx 6px rgba(0, 0, 0, 0.2);
    border-radius: 0px 0px 24rpx 24rpx;
    .modeIconBox {
      position: absolute;
      width: 96rpx;
      height: 136rpx;
      left: 28rpx;
      top: 48rpx;

      .modeIconBox_top {
        position: absolute;
        width: 88rpx;
        height: 88rpx;
        image {
          width: 100%;
          height: 100%;
        }
      }
      .modeIconbox_bot {
        position: absolute;
        width: 96rpx;
        height: 32rpx;
        bottom: 0;
        border: 2rpx solid #fa8c16;
        box-sizing: border-box;
        border-radius: 4rpx;
        .iconboxBot_text {
          position: absolute;
          width: 80rpx;
          height: 20rpx;
          top: 5rpx;
          left: 6rpx;
          font-family: PingFang SC;
          font-style: normal;
          font-weight: normal;
          font-size: 20rpx;
          line-height: 20rpx;
          text-align: center;
          color: #fa8c16;
        }
      }
    }
    .topContainerText {
      position: absolute;
      width: 506rpx;
      height: 108rpx;
      left: 156rpx;
      top: 32rpx;
      font-family: PingFang SC;
      font-style: normal;
      font-weight: 500;
      font-size: 36rpx;
      line-height: 150%;
      color: #121b36;
    }
    .topContainerUserInfo {
      position: absolute;
      width: 274rpx;
      height: 28rpx;
      left: 156rpx;
      top: 172rpx;
      font-family: PingFang SC;
      font-style: normal;
      font-weight: normal;
      font-size: 28rpx;
      line-height: 28rpx;
      color: #000000;
    }
    .arrowBox {
      position: absolute;
      width: 18rpx;
      height: 34rpx;
      top: calc(50% - 34rpx / 2);
      right: 34rpx;
      image {
        width: 100%;
        height: 100%;
      }
    }
  }
  .exceptTimeBox {
    position: relative;
    left: 24rpx;
    width: 702rpx;
    height: 112rpx;
    margin-top: 24rpx;
    background: #ffffff;
    border-radius: 12rpx;
    .except_text1 {
      position: absolute;
      width: 112rpx;
      height: 28rpx;
      left: 24rpx;
      top: 24rpx;
      font-family: PingFang SC;
      font-style: normal;
      font-weight: 500;
      font-size: 28rpx;
      line-height: 28rpx;
      color: #000000;
    }
    .except_text2 {
      position: absolute;
      width: 336rpx;
      height: 24rpx;
      left: 24rpx;
      top: 64rpx;
      font-family: PingFang SC;
      font-style: normal;
      font-weight: normal;
      font-size: 24rpx;
      line-height: 24rpx;
      color: #8c8c8c;
    }
    .except_text3 {
      position: absolute;
      right: 24rpx;
      top: 42rpx;
      font-family: PingFang SC;
      font-style: normal;
      font-weight: 500;
      font-size: 28rpx;
      line-height: 28rpx;
      color: #000000;
    }
  }
  .orderDetials {
    position: relative;
    width: 702rpx;
    left: 24rpx;
    margin-top: 24rpx;
    background: #ffffff;
    border-radius: 12rpx;
    padding-left: 24rpx;
    padding-bottom: 24rpx;
    padding-top: 24rpx;
    .orderDetials_title {
      font-weight: 500;
      font-size: 28rpx;
      line-height: 28rpx;
    }
    .orderDetials_package {
      margin-top: 28rpx;
      display: flex;
      .package_left {
        font-size: 24rpx;
        line-height: 24rpx;
        color: #fa8c16;
        margin-left: -12rpx;
      }
      .package_right {
        font-size: 24rpx;
        line-height: 24rpx;
        color: #8c8c8c;
      }
    }
    .orderDetials_orders {
      margin-top: 12rpx;
      .orders-item {
        width: 100%;
        height: 52rpx;
        padding-top: 12rpx;
        .item_leftT {
          width: 120rpx;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          font-size: 28rpx;
          line-height: 28rpx;
          color: #000;
          display: inline-block;
        }
        .item_centerT {
          font-size: 28rpx;
          line-height: 28rpx;
          display: inline-block;
          margin-left: 110rpx;
          color: #8c8c8c;
          .centerT_item:first {
            margin-left: 0;
          }
          .centerT_item {
            display: inline-block;
            margin-left: 48rpx;
          }
        }
        .item_centerR {
          display: inline-block;
          margin-left: 100rpx;
          font-size: 14px;
          line-height: 14px;
        }
      }
    }
    .openTitle {
      margin-top: 48rpx;
      text-align: center;
      .openTitle_t {
        display: inline-block;
        font-style: normal;
        font-weight: normal;
        font-size: 24rpx;
        line-height: 24rpx;
        color: #8c8c8c;
        .toBot {
          margin-left: 14rpx;
          border: solid black;
          border-width: 0 2rpx 2rpx 0;
          display: inline-block;
          padding: 6rpx;
          transform: rotate(45deg);
          margin-bottom: 6rpx;
        }
        .toTop {
          margin-left: 14rpx;
          border: solid black;
          border-width: 0 2rpx 2rpx 0;
          display: inline-block;
          padding: 6rpx;
          transform: rotate(-135deg);
          margin-bottom: -6rpx;
        }
      }
    }
    .line {
      margin-top: 50rpx;
      width: 654rpx;
      height: 0rpx;
      border: 2rpx solid rgba(0, 0, 0, 0.06);
    }
    .tip {
      margin-top: 26rpx;
      .tip:first-child {
        margin-top: 0;
      }
      ._tip {
        display: flex;
        justify-content: space-between;
        width: 654rpx;
        margin-top: 24rpx;
        ._tip-left {
          font-size: 24rpx;
          line-height: 24rpx;
          color: #121b36;
        }
        ._tip-right {
          font-size: 24rpx;
          line-height: 24rpx;
          color: #121b36;
        }
        .pac_l {
          color: #8c8c8c;
        }
        .pac_r {
          color: #8c8c8c;
          font-size: 28rpx;
          line-height: 28rpx;
        }
      }
    }
    .totalBox {
      width: 226rpx;
      margin-right: 24rpx;
      margin-top: 32rpx;
      height: 32rpx;
      float: right;
      .total_left {
        float: left;
        font-size: 32rpx;
        line-height: 32rpx;
        color: #121b36;
      }
      .total_right {
        float: right;
        font-size: 32rpx;
        line-height: 32rpx;
        color: #121b36;
      }
    }
  }
  .orderDetials::after {
    content: '';
    display: block;
    clear: both;
  }
  .payBox {
    width: 351px;
    position: relative;
    margin-top: 24rpx;
    left: 24rpx;
    padding: 24rpx 24rpx 36rpx 24rpx;
    background-color: #fff;
    .payBox_title1 {
      font-weight: 500;
      font-size: 28rpx;
      line-height: 28rpx;
      color: #000000;
    }
    .payBox_title2 {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 24rpx;
      .payTitel2_left {
        display: inline-block;
        font-size: 28rpx;
        line-height: 28rpx;
        color: #000;
      }
      .payTitel2_right {
        width: 116rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .payImageBox {
          width: 48rpx;
          height: 48rpx;
          image {
            width: 100%;
            height: 100%;
          }
        }
        .payIamgeBox_title {
          font-weight: 500;
          font-size: 28rpx;
          line-height: 28rpx;
          color: #000000;
        }
      }
      .remarks {
        display: flex;
        align-items: center;
        justify-content: space-between;
        .remarks_context {
          font-size: 28rpx;
          line-height: 28rpx;
          text-align: right;
          color: #bfbfbf;
        }
        .rig {
          margin-left: 16rpx;
          border: solid #bfbfbf;
          border-width: 0 2rpx 2rpx 0;
          display: inline-block;
          padding: 6rpx;
          transform: rotate(-45deg);
        }
      }
    }
  }
  .payNow {
    width: 702rpx;
    height: 112rpx;
    background: #fa8c16;
    border-radius: 88rpx;
    margin-top: 48rpx;
    margin-bottom: 48rpx;
    margin-left: 24rpx;
    padding-top: 24rpx;
    padding-left: 30rpx;
    padding-right: 24rpx;
    display: flex;
    justify-content: space-between;
    .payNowLeftBox {
      display: inline-block;
      .payNowLeftBox_t1 {
        font-weight: 500;
        font-size: 36rpx;
        line-height: 36rpx;
        color: #ffffff;
      }
      .payNowLeftBox_t2 {
        font-size: 10px;
        line-height: 10px;
        margin-top: 8rpx;
        color: #ffffff;
      }
    }
    .payNowRightBox {
      display: inline-block;
      .payNowRightBox_t1 {
        font-weight: 500;
        font-size: 32rpx;
        line-height: 32rpx;
        color: #ffffff;
      }
      .payNowRightBox_t2 {
        margin-top: 12rpx;
        text-align: center;
        font-size: 10px;
        line-height: 10px;
        color: #ffffff;
      }
    }
  }
}
